Create New Page
- Symfony
How to add a New Page:
- Create New File with the
html.twigextenstion in thetemplates/directory. - Create Controller for different methods related to page. (Optional. You can use default controller also.) with the routes
-
Add page link to
templates/layouts/_sidebar.html.twigfor vertical menu -
Add page link to
templates/layouts/_horizontal.html.twigfor Horizontal menu -
Add page name key in
public/assets/lang/en{all language folder}/.jsonfile to display in multi language.
Steps to add a new page :
-
Step 1: Create a file with the
test.html.twigunder thetemplates/directory. Let's create a testPage for an example with filename test.html.twig and placing the below code in that file. -
Step 2: After creating above file, you need to declare its route with method where it can be served on the browser, suppose you want created page to be serve on the route http://localhost:8000/test . To access this page define its routes and it's method in the
src/Controller/HomeController.phpfile.
#[Route('/test', name: 'test')]
public function test()
{
return $this->render('test.html.twig');
}
-
Step 3: After defining the route and it's method, add page link to sidebar at
Option 1: To add item in menu.templates/layouts/_horizontal.html.twigORtemplates/layouts/_sidebar.html.twigfile.
<a href="test" class="dropdown-item" key="t-test">Test</a>
-
Step 4: Add page name to
assets/lang/en{all language folder}/.jsonfile to display in multi language.
"t-test" => "Test"
{% extends 'layouts/base.html.twig' %}
{% block title %}Test Page{% endblock %}
{% block stylesheets %}
{% endblock %}
{% block content %}
{% include 'layouts/_topbar.html.twig' with {title: 'Test' } %}
<div>
.........
</div>
{% endblock %}
{% block javascripts %}
<script src="assets/js/app.js"></script>
{% endblock %}
yarn run build command in the project root directory. After running this process you need to run the command symfony server:start . It will serve your app on the localhost.